<template>
  <div class="container">
    <Breadcrumb :items="['数据分析', '五大类问题数据统计']" />
    <a-card class="general-card" style="padding-top:5px">
      <a-row>
        <a-col :flex="1">
          <a-form :model="formModel" label-align="right">
            <a-row :gutter="16">
              <a-space wrap :size="5">
                <a-form-item field="quarter" label-col-flex="70px" label="问题类别">
                  <a-select v-model="formModel.bigTypeNameList.value" :style="{ width: '240px' }" allow-clear multiple
                    :max-tag-count="1" placeholder="全部" allow-search :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option :value="item.label" v-for="item in questionList1">{{ item.label }}</a-option>
                  </a-select>
                </a-form-item>

                <a-form-item field="quarter" label-col-flex="120px" label="清单查摆问题表现">
                  <a-select v-model="formModel.prominentProblemList.value" :style="{ width: '240px' }" allow-clear multiple
                    :max-tag-count="1" placeholder="全部" allow-search :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option :value="item.label" v-for="item in questionList">{{ item.label }}</a-option>
                  </a-select>
                </a-form-item>

                <a-form-item field="quarter" label-col-flex="100px" label="突出问题类型">
                  <a-select v-model="formModel.problemTypeList.value" :style="{ width: '240px' }" allow-clear multiple
                    :max-tag-count="1" placeholder="全部" allow-search :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option :value="item.label" v-for="item in questionList2">{{ item.label }}</a-option>
                  </a-select>
                </a-form-item>

                  <a-form-item field="department" label-col-flex="70px" label="责任单位">
                    <a-select v-model="formModel.department.value" placeholder="请输入责任单位" :style="{ width: '160px' }"
                      allow-clear
                      allow-search>
                      <a-option v-for="item in departmentList" :key="item.id" :value="item.department">{{ item.department }}</a-option>
                    </a-select>
                  </a-form-item>

                  <a-form-item field="quarter" label-col-flex="70px"
                    label="创建日期">
                    <a-range-picker
                      v-model="formModel.dateRange.value"
                      mode="date"
                      style="width: 240px;"
                    />
                  </a-form-item> 

                  <a-form-item field="quarter" label-col-flex="70px"
                    label="完成时限">
                    <a-range-picker
                      v-model="formModel.dateRange2.value"
                      mode="date"
                      style="width: 240px;"
                    />
                  </a-form-item> 
                  <!-- //处置量 -->
                  <a-form-item field="quarter" label-col-flex="70px"
                    label="整改率">
                    <a-select
                      v-model="formModel.quarter.value"
                      allow-clear
                      placeholder="全部"
                      style="width: 180px;">
                      <a-option value="1">
                        <a-badge status="danger" style="margin-right: 6px;"/>0%-30%</a-option>
                      <a-option value="2">
                        <a-badge status="warning" style="margin-right: 6px;" />30%-70%</a-option>
                      <a-option value="3">
                        <a-badge status="processing" style="margin-right: 6px;" />70%-100%</a-option>
                    </a-select>
                  </a-form-item>
                  
                <a-form-item label-col-flex="0px" label="">
                  <a-space direction="horizontal" :size="12">
                    <a-button @click="fetchData">
                      <template #icon>
                        <icon-search />
                      </template>
                      查询
                    </a-button>
                  <a-radio-group v-model="isShowTable" type="button">
                      <a-radio :value="true">表格</a-radio>
                      <a-radio :value="false">图表</a-radio>
                    </a-radio-group>
                  </a-space>
                </a-form-item>
              </a-space>
            </a-row>
          </a-form>
        </a-col>
      </a-row>
      <a-table v-if="isShowTable" :data="renderData" :pagination="false" :bordered="{cell:true}" :scrollbar="true"
        :summary="summary"
          :scroll="{ x: '100%', y: '75vh' }">
          <template #columns>
            <a-table-column title="问题类型" align="center" data-index="bigTypeName" fixed="left" :width="150">
              <template #cell="{record,rowIndex}">
                <div style="display: flex;">
                  <a-badge v-if="record.closedCount/record.problemsFoundCount <=0.3" status="danger" />
                  <a-badge v-else-if="record.closedCount/record.problemsFoundCount <=0.7" status="warning" />
                  <a-badge v-else status="processing" />
                  <div style="flex: 1;">
                    <span>{{ record ? record.bigTypeName : (rowIndex == 0? '合计':'') }}</span>
                  </div>
                </div>
              </template>
            </a-table-column>
            <a-table-column title="自查自纠发现问题数" align="center" data-index="problemsFoundCount" :width="130">
            </a-table-column>
            <a-table-column title="整治处理中问题数" align="center" data-index="inProgressCount" :width="130">
            </a-table-column>
            <a-table-column title="已整治销号总数" align="center" data-index="closedCount" :width="130">
            </a-table-column>
            <a-table-column title="新增问题数" align="center" data-index="problemsFoundCount" :width="130">
            </a-table-column>
            <a-table-column title="新增销号数" align="center" data-index="closedCount" :width="130">
            </a-table-column>
            <!-- 新增销号数 -->
            <a-table-column title="整改率" align="center" data-index="zgl" :width="130" :sortable="{
              sortDirections: ['ascend', 'descend']
            }">
              <template #cell="{ record }"> 
                <span>
                  {{ record.zgl }}%
                </span>
              </template>
            </a-table-column>
            <!-- <a-table-column title="查处率" align="center" data-index="ccl" :width="130" :sortable="{
              sortDirections: ['ascend', 'descend']
            }">
              <template #cell="{ record }"> 
                <span v-if="record.ccl != ''">
                  {{ record.ccl }}%
                </span>
              </template>
            </a-table-column> -->
            <a-table-column v-if="isShowZd" title="建立制度数" align="center" data-index="establishedSystems" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="查处违纪违法案件数" align="center" data-index="disciplinaryCases" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="组织处理人数" align="center" data-index="punishedPersons" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="纪律处分人数" align="center" data-index="disciplinaryPunishedPersons" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="发出执纪执法建议（文书）数" align="center" data-index="recommendationLetters" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="印发通报期数" align="center" data-index="circularCount" :width="150">
            </a-table-column>
            <a-table-column v-if="isShowZd" title="通报涉及问题数" align="center" data-index="circularIssues" :width="150">
            </a-table-column>
          </template>
        </a-table>

        <div v-if="isShowTable" style="padding-left: 16px;padding-top: 10px;">
          <a-badge status="danger" text="整改率低于30%"  />
            <a-badge status="warning" text="整改率低于70%" style="margin-left: 10px;"/>
            <a-badge status="processing" text="整改率大于70%" style="margin-left: 10px;"/>
        </div>

        <a-button v-if="isShowTable" style="position: fixed;right: 23px;top: 215px;" shape="round" @click="isShowZd=!isShowZd">
         <template #icon>
            <icon-to-left v-if="isShowZd"/>
            <icon-to-right v-else/>
          </template>
        </a-button>

        <div v-if="!isShowTable" style="margin-top: 20px;">
        <!-- //展示图表 -->
        <a-row>
          <a-col>
            <Chart height="589px" :option="chartOption" />
          </a-col>
        </a-row>
      </div>

    </a-card>
  </div>
</template>

<script lang="ts" setup>
import { computed, ref, reactive, watch, nextTick } from 'vue';
import { useRouter } from 'vue-router';
import {graphic} from 'echarts';
import { Modal, Message } from '@arco-design/web-vue';
  import dayjs from 'dayjs';
import { postRequest } from '@/api/common';

const downAll = () => {

}

const isShowTable = ref(true);
const isShowZd = ref(false);
const chartData1 = ref<any[]>([]);
const chartData2 = ref<any[]>([]);
const chartData3 = ref<any[]>([]);
const chartData4 = ref<any[]>([]);


const chartOption = reactive({
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      crossStyle: {
        color: '#999'
      }
    }
  },
  legend: {
    data: ['总问题数', '整治处理中问题数', '已整治销号数', '整改率'],
    padding: [0, 20, 20, 0]
  },
  grid: {
    top: 30,
    left: 50,
    right: 50
  },
  xAxis: [
    {
      type: 'category',
      data: ['建章立制类', '存量化解类', '新增问题类', '试点类', '其他类'],
      axisPointer: {
        type: 'shadow'

      },
      axisLabel: {
        fontSize: 13,
      }
    }
  ],
  yAxis: [
    {
      type: 'value',
      min: 0,
      axisLabel: {
        formatter: '{value}'
      }
    },
    {
      type: 'value',
      min: 0,
      max: 100,
      axisLabel: {
        formatter: '{value}%'
      }
    },
  ],
  series: [
    {
      name: '总问题数',
      type: 'bar',
      stack: 'Ad',
      itemStyle: {
        color: '#b28e65',
        borderWidth: 2,
      },
      label: {
          show: true,
          position: 'top', // 可以是 'top', 'bottom', 'left', 'right' 等位置
          formatter: '{c}' // c 表示系列中的数据值
      },
      barWidth: 26,
      tooltip: {
        valueFormatter: function (value) {
          return value + '  ';
        }
      },
      z: 99,
      data: chartData1,
    },

  //  {
  //     name: '总问题数',
  //     type: 'bar',
  //     stack: 'Ad',
  //     itemStyle: {
  //       color: new graphic.LinearGradient(0, 1, 0, 0, [{
  //           offset: 0,
  //           color: '#e2d7c740' // 起始颜色
  //       }, {
  //           offset: 1,
  //           color: '#ead6c230' // 结束颜色
  //       }]),
  //       borderColor: new graphic.LinearGradient(0, 1, 0, 0, [{
  //           offset: 0,
  //           color: '#e2d7c7' // 起始颜色
  //       }, {
  //           offset: 1,
  //           color: '#ead6c2' // 结束颜色
  //       }]),
  //       borderWidth: 2,
  //     },
  //     barWidth: 30,
  //     tooltip: {
  //       valueFormatter: function (value) {
  //         return value + '  ';
  //       }
  //     },
  //     z: 99,
  //     data: chartData1,
  //   },
  //   {
  //     name: '整治处理中问题数',
  //     type: 'pictorialBar',
  //     symbol: 'path://M0,0 L100,0 L100,100 L0,100Z',
  //     z: 18,
  //     symbolOffset: [-6, 0],//柱子的位置
  //     barWidth: 24,
  //     tooltip: {
  //       valueFormatter: function (value) {
  //         return value + '  ';
  //       }
  //     },
  //     itemStyle: {
  //       color: '#b28e65', // 红色
  //       borderRadius: 2
  //     },
  //     emphasis: {
  //       itemStyle: {
  //         color: '#b28e65' // 高亮时颜色加深
  //       }
  //     },
  //     data: chartData2,
  //   },
  //   {
  //     name: '已整治销号数',
  //     type: 'pictorialBar',
  //     barWidth: 24,
  //     symbol: 'path://M0,0 L100,0 L100,100 L0,100Z',
  //     symbolOffset: [-6, 0],//柱子的位置
  //     z: 12,
  //     tooltip: {
  //       valueFormatter: function (value,params) {
  //         console.log(params);
  //         return chartData1.value[params] - chartData2.value[params] + '  ';
  //       }
  //     },
  //     itemStyle: {
  //       color: new graphic.LinearGradient(0, 0, 0, 1, [{
  //           offset: 0,
  //           color: '#b38e6a' // 起始颜色
  //       }, {
  //           offset: 1,
  //           color: '#ffffff' // 结束颜色
  //       }]),
  //       borderRadius: 6
  //     },
  //     data: chartData3,
  //   },
    {
      name: '整改率',
      type: 'bar',
      barGap: '0',
      yAxisIndex: 1,
      itemStyle: {
        color: '#f2c27f', // 红色
      },
      emphasis: {
        itemStyle: {
          color: '#f2c27f', // 红色
        }
      },
      label: {
          show: true,
          position: 'top', // 可以是 'top', 'bottom', 'left', 'right' 等位置
          formatter: '{c}%' // c 表示系列中的数据值
      },
      barWidth: 22,
      z: 110,
      tooltip: {
        valueFormatter: function (value) {
          return value + ' % ';
        }
      },
      data: chartData4,
    },
  ]
});


let sumData = reactive({
    bigTypeName: '合计',
    problemsFoundCount: 0,
    closedCount: 0 as any,
    inProgressCount: 0,
    disciplinaryCases: 0,
    zgl:0 as any,
    ccl:0 as any,
    punishedPersons: 0,
    disciplinaryPunishedPersons:0,
    circularIssues: 0 as any,
    recommendationLetters: 0,
    establishedSystems:0,
    circularCount:0
  })
  const summary = () => {
    return [sumData]
  }

const questionList:any[] = [
  {
    label: "“民生小案”破案",value: "101",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "1" }]
  },
  {
    label: "命案防范",value: "102",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "2" }]
  },
  {
    label: "矛盾纠纷实质性化解",value: "103",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "3" }]
  },
  {
    label: "执行难破解难",value: "104",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "4" }]
  },
  {
    label: "后进村整顿",value: "105",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "5" }]
  },
  {
    label: "行政村布局调整“后半篇”文章",value: "106",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "6" }]
  },
  {
    label: "12345投诉办理不及时",value: "107",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "7" }]
  },
  {
    label: "不担当不作为集中整治处理中其它突出问题",value: "108",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "8" }]
  },
  {
    label: "政绩观偏差、搞“面子工程”问题",value: "109",
    children: [{ label: "政绩观偏差、搞“面子工程”问题",value: "9" }]
  },
  {
    label: "执行政策“一刀切”、层层加码问题",value: "110",
    children: [{ label: "执行政策“一刀切”、层层加码问题",value: "10" }]
  },
  {
    label: "文风会风不实、搞文山会海问题",value: "111",
    children: [{ label: "文风会风不实、搞文山会海问题",value: "11" }]
  },
  {
    label: "整治形式主义为基层减负存在差距问题",value: "112",
    children: [{ label: "整治形式主义为基层减负存在差距问题",value: "12" }]
  },
  {
    label: "未成年人保护和预防犯罪",value: "113",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "13" }]
  },
  {
    label: "道路交通安全综合治理",value: "114",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "14" }]
  },
  {
    label: "精神障碍患者服务管理",value: "115",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "15" }]
  },
  {
    label: "电信网络诈骗打击",value: "116",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "16" }]
  },
  {
    label: "禁毒工作",value: "117",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "17" }]
  },
  {
    label: "新就业群体“急难愁盼”",value: "118",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "18" }]
  },
  {
    label: "高额彩礼",value: "119",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "19" }]
  },
  {
    label: "外籍新娘管理服务",value: "120",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "20" }]
  },
  {
    label: "失能失智老人日间照护",value: "121",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "21" }]
  },
  {
    label: "留守妇女就业",value: "122",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "22" }]
  },
  {
    label: "留守儿童假期托管",value: "123",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "23" }]
  },
  {
    label: "慢性病老人心电图“一张网”",value: "124",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "24" }]
  },
  {
    label: "中小学生午休“趴睡”变“躺睡”",value: "125",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "25" }]
  },
  {
    label: "市区老年人娱乐场所建设",value: "126",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "26" }]
  },
  {
    label: "“群腐”集中整治处理中其他突出问题",value: "127",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "27" }]
  },
  {
    label: "违规吃喝问题",value: "128",
    children: [{ label: "违规吃喝问题",value: "28" }]
  },
  {
    label: "违规收送礼品礼金问题",value: "129",
    children: [{ label: "违规收送礼品礼金问题",value: "29" }]
  },
  {
    label: "借调研培训等名义公款旅游问题",value: "130",
    children: [{ label: "借调研培训等名义公款旅游问题",value: "30" }]
  },
  {
    label: "违规建设、奢华装修楼堂馆所问题",value: "131",
    children: [{ label: "违规建设、奢华装修楼堂馆所问题",value: "31" }]
  },
  {
    label: "开展照顾性、无实质内容的一般性出国（境）活动问题",value: "132",
    children: [{ label: "开展照顾性、无实质内容的一般性出国（境）活动问题",value: "32" }]
  },
  {
    label: "酒驾醉驾问题",value: "133",
    children: [{ label: "酒驾醉驾问题",value: "33" }]
  },
  {
    label: "违规打牌和赌博问题",value: "134",
    children: [{ label: "违规打牌和赌博问题",value: "34" }]
  },
  {
    label: "化解疑难信访积案",value: "135",
    children: [{ label: "化解疑难信访积案",value: "35" }]
  },
  {
    label: "中小学“校园餐”等领域侵害群众利益问题",value: "136",
    children: [{ label: "中小学“校园餐”等领域侵害群众利益问题",value: "36" }]
  },
  {
    label: "公共交通服务质量不优的问题",value: "137",
    children: [{ label: "公共交通服务质量不优的问题",value: "37" }]
  },
  {
    label: "物业服务履约不到位、侵害业主公共收益问题",value: "138",
    children: [{ label: "物业服务履约不到位、侵害业主公共收益问题",value: "38" }]
  },
  {
    label: "大气污染治理问题",value: "139",
    children: [{ label: "大气污染治理问题",value: "39" }]
  }
];
const questionList1 :any[] = [
 {
    label: "建章立制类",
    value: "建章立制类"
  },
  {
    label: "存量化解类",
    value: "存量化解类"
  },
  {
    label: "新增问题类",
    value: "新增问题类"
  },
  {
    label: "试点类",
    value: "试点类"
  },
  {
    label: "其他类",
    value: "其他类"
  }
];

const questionList2:any[] = [
  {
    label: "不担当不作为、推诿扯皮问题"
  },
  {
    label: "政绩观偏差、搞“面子工程”问题"
  },
  {
    label: "执行政策“一刀切”、层层加码问题"
  },
  {
    label: "文风会风不实、搞文山会海问题"
  },
  {
    label: "整治形式主义为基层减负存在差距问题"
  },
  {
    label: "漠视群众、脱离群众、侵害群众利益问题"
  },
  {
    label: "违规吃喝问题"
  },
  {
    label: "违规收送礼品礼金问题"
  },
  {
    label: "借调研培训等名义公款旅游问题"
  },
  {
    label: "违规建设、奢华装修楼堂馆所问题"
  },
  {
    label: "开展照顾性、无实质内容的一般性出国（境）活动问题"
  },
  {
    label: "酒驾醉驾问题"
  },
  {
    label: "违规打牌和赌博问题"
  },
  {
    label: "化解疑难信访积案"
  },
  {
    label: "中小学“校园餐”等领域侵害群众利益问题"
  },
  {
    label: "公共交通服务质量不优的问题"
  },
  {
    label: "物业服务履约不到位、侵害业主公共收益问题"
  },
  {
    label: "大气污染治理问题"
  }
];

const router = useRouter();
const formModel = {
  bigTypeNameList: ref<any[]>([]),
  prominentProblemList: ref<any[]>([]),
  problemTypeList: ref<any[]>([]),
    department: ref<any>(""),
    dateRange: ref<any[]>([]),
    dateRange2: ref<any[]>([]),
    isTopTen: ref(""),
    quarter: ref(""),
};

formModel.department.value = undefined;
formModel.dateRange.value = [dayjs().date(1), dayjs()];
const renderData = ref<any[]>([]);

const sumFields = [
  'problemsFoundCount',
  'closedCount',
  'inProgressCount',
  'disciplinaryCases',
  'punishedPersons',
  'zgl',
  'ccl',
  'disciplinaryPunishedPersons',
  'recommendationLetters',
  'circularIssues',
  'establishedSystems',
  'circularCount'
];

function groupAndSumByProblem(data:any) {
  const grouped = {};

  data.forEach((item:any) => {
    const problem = item.bigTypeName;
    if (!grouped[problem]) {
      // 初始化分组对象
      grouped[problem] = {
        bigTypeName: problem,
        count: 0
      };

      // 初始化所有求和字段为0
      sumFields.forEach(field => {
        grouped[problem][field] = 0;
      });
    }

    // 计数
    grouped[problem].count++;

    // 累加数值字段
    sumFields.forEach(field => {
      if (item[field] !== undefined) {
        grouped[problem][field] += item[field] || 0;
      }
    });
  });

  // 转换为数组形式
  return Object.values(grouped);
}

// 修改fetchData函数，直接使用静态数据
const fetchData = async () => {

    sumData.problemsFoundCount = 0;
    sumData.closedCount = 0;
    sumData.inProgressCount = 0;
    sumData.disciplinaryCases = 0;
    sumData.punishedPersons = 0;
    sumData.zgl = 0;
    sumData.ccl = 0;
    sumData.disciplinaryPunishedPersons = 0;
    sumData.recommendationLetters = 0;
    sumData.circularIssues = 0;
    sumData.establishedSystems = 0;
    sumData.circularCount = 0;

    let startTime = "";
    let endTime = "";
    if(formModel.dateRange.value!=null && formModel.dateRange.value.length>1){
      startTime = formModel.dateRange.value[0];
      endTime = formModel.dateRange.value[1];
    }
    let res = await postRequest("dsms/jyData/queryData", {
      prominentProblemList:formModel.prominentProblemList.value,
      problemTypeList:formModel.problemTypeList.value,
      bigTypeNameList:formModel.bigTypeNameList.value,
      department:formModel.department.value,
    startTime: dayjs(startTime).format('YYYY-MM-DD HH:mm:ss'),
    endTime: dayjs(endTime).format('YYYY-MM-DD HH:mm:ss'),
      pageNum: 1,
      pageSize: 9999
    });

  res.list.forEach((item:any,index:number)=>{
      item.index = index + 1;
      if(item.circularNo != null && item.circularnO != '' && item.circularNo.length>2){
        item.circularIssuesList = JSON.parse(item.circularNo);
        item.circularCount = item.circularIssuesList.length;
      }else{
        item.circularCount = 0;
      }
      sumData.circularCount = sumData.circularCount + item.circularCount;
      sumData.problemsFoundCount = sumData.problemsFoundCount + item.problemsFoundCount;;
      sumData.closedCount = sumData.closedCount + item.closedCount;
      sumData.inProgressCount = sumData.inProgressCount + item.inProgressCount;
      sumData.disciplinaryCases = sumData.disciplinaryCases + item.disciplinaryCases;
      sumData.punishedPersons = sumData.punishedPersons + item.punishedPersons;
      sumData.disciplinaryPunishedPersons = sumData.disciplinaryPunishedPersons + item.disciplinaryPunishedPersons;
      sumData.recommendationLetters = sumData.recommendationLetters + item.recommendationLetters;
      sumData.circularIssues = sumData.circularIssues + item.circularIssues;
      sumData.establishedSystems = sumData.establishedSystems + item.establishedSystems;
  });

  // 计算合计行数据
  const groupedData = groupAndSumByProblem(res.list);
  let czl = formModel.quarter.value;
  for (let i = groupedData.length - 1; i >= 0; i--) {
    let item:any = groupedData[i];
    item.zgl = (item.closedCount / item.problemsFoundCount * 100).toFixed(2);
    if(czl == '1'){
      if(item.zgl>30){
       groupedData.splice(i, 1); // 删除当前元素
      }
    }else if(czl == '2'){
      if(item.zgl>70 || item.zgl<=30){
       groupedData.splice(i, 1); // 删除当前元素
      }
    }else if(czl == '3'){
      if(item.zgl<= 70){
       groupedData.splice(i, 1); // 删除当前元素
      }
    }
  }
  chartData1.value = [];
  chartData2.value = [];
  chartData3.value = [];
  chartData4.value = [];
  groupedData.forEach((item:any)=>{
    item.zgl = (item.closedCount / item.problemsFoundCount * 100).toFixed(2);
    item.ccl = (item.problemsFoundCount / 39 * 100).toFixed(2);
    chartData1.value.push(item.problemsFoundCount);
    chartData2.value.push(item.inProgressCount);
    chartData3.value.push(item.inProgressCount+item.closedCount);
    chartData4.value.push(item.zgl);
  })
  sumData.zgl = (sumData.closedCount / sumData.problemsFoundCount * 100).toFixed(2);
  sumData.ccl = '';
  renderData.value = groupedData;




};

let departmentList = ref<any[]>([]);
const fetchDepartment = async () => { 
  // departmentList
  let res = await postRequest("dsms/jyData/getUserList", {
    pageSize:999
  });
  // 将res 去重 根据department 去重
  res = res.filter((item: any, index: number, self: any) => {
    return self.findIndex((t: any) => t.department === item.department) === index;
  });
  const excludedCounties = ['黄州区', '团风县', '红安县', '麻城市', '罗田县', '英山县', '浠水县', '蕲春县', '武穴市', '黄梅县', '龙感湖', '白莲河'];
  res = res.filter(item => !excludedCounties.includes(item.department));
  departmentList.value = res;
};

fetchDepartment();
fetchData();
</script>

<script lang="ts">
export default {
  name: 'comprehensive',
};
</script>

<style scoped lang="less">
.container {
  padding: 0 20px 20px 20px;
}

::v-deep(.arco-input-wrapper .arco-input[disabled]) {
  color: black;
  -webkit-text-fill-color: black;
}
</style>